<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>样式表综合使用</title>
</head>
<style>
    table{
        width: 500px;
        height: 200px;
        border: 1px solid red;
        border-collapse: collapse;
    }
    td{
        border:  1px solid red;
    }
    /*设置所有奇数td元素*/
    td:nth-child(odd){
        text-align: center;
        padding-right: 10px;
        font-size: 18px;
    }
    /*类选择器*/
    .inputTxt{
        width: 300px;
        height: 20px;
        margin-left: 10px;
        background: cyan;
        font-size: 15px;
    }
    button{
        width: 200px;
        height: 60px;
        margin: 10px;
        font-size: 20px;
        background-color: yellow;
        color: deepskyblue;
        font-weight:bold;
        border-radius: 10px;
    }
    button:hover{
        cursor: pointer;
    }
    button:active{
        border: 3px solid darkorange;
    }
</style>
<body>
<form>
    <table  border="0" cellpadding="0" cellspacing="0" align="center">
        <tr>
            <td>姓名：</td>
            <td>
                <input type="name" name="username" class="inputTxt">
            </td>
        </tr>
        <tr>
            <td>密码：</td>
            <td>
                <input type="password" name="password" class="inputTxt">
            </td>
        </tr>

        <tr>
            <td>性别</td>
            <td>
                <input type="radio" name="sex" checked="checked" value="男">男
                <input type="radio" name="sex" checked="checked" value="女">女
            </td>
        </tr>
        <tr>
            <td colspan="2" >
                <button>注册</button>
                <button type="reset">重置</button>
            </td>
        </tr>
    </table>
</form>
</body>
</html>